<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单项type属性</title>
</head>
    <body>
    <form action="#" method="post" autocomplete="off">

        <!--用户名栏-->
        <label for="username">用户名:</label>
        <input type="text" id="username" name="username"value=""
               placeholder="请输入用户名" required/> <br/>
<!--        <button type="submit">提交</button>-->
<!--        <button type="reset">重置</button>-->
<!--        <button type="button">按钮</button>-->


        <!--密码栏-->
        <label for="password">密码:</label>
        <input type="password" id="password" name="password" value=""
               placeholder="请输入密码" required/> <br/>
<!--        <button type="submit">提交</button>-->
<!--        <button type="reset">重置</button>-->
<!--        <button type="button">按钮</button>-->


        <!--邮箱栏-->

        <label for="email">邮箱:</label>
        <input type="email" id="email" name="email" value=""
               placeholder="请输入邮箱" required/> <br/>
<!--        <button type="submit">提交</button>-->
<!--        <button type="reset">重置</button>-->
<!--        <button type="button">按钮</button>-->


        <!--性别-->
        <label for="gender">性别:</label>
        <input type="radio" id="gender" name="gender" value="men"/>男
        <input type="radio"  name="gender" value="women"/>女 <br/>

        <!--爱好-->
        <label for="hobby">爱好:</label>
        <input type="checkbox" id="hobby" name="hobby" value="吃" /> 玩游戏
        <input type="checkbox"  name="hobby" value="喝"/> 运动
        <input type="checkbox"  name="hobby" value="玩"/> 看电视
        <br/>

        <!--生日-->
        <label for="birthday">生日:</label>
        <input type="date" id="birthday" name="birthday" value=""/>
        <br/>

        <!--年龄-->
        <label for="age">年龄:</label>
        <input type="number" id="age" name="age" value=""/> <br/>


        <!--心情值-->
        <label for="range">心情值1~10</label>
        <input type="range" id="range" name="range" value=""/> <br/>

        <!--电话-->
        <label for="tel">电话</label>
        <input type="tel" id="tel" name="tel" value=""/> <br/>

        <!--个人网站-->
        <label for="url">个人网站</label>
        <input type="url" id="url" name="url" value=""/> <br/>

        <!--文件上传-->
        <label for="file">文件上传</label>
        <input type="file" id="file" name="file" value=""/> <br/>

        <!--隐藏信息-->
        <label for="hidden">隐藏信息</label>
        <input type="hidden" id="hidden" name="hidden" value=""/> <br/>

        <!--提交-->
        <button type="submit">提交</button>
        <button type="reset">重置</button>
        <button type="button">按钮</button>




    </form>
    </body>
</html>